<!DOCTYPE html>
<html lang="en">
<head>
    <head>
        <meta charset="utf-8">
        <title>种子管理</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
        <link rel="stylesheet" href="../../lib/font-awesome-4.7.0/css/font-awesome.min.css" media="all"/>
        <link rel="stylesheet" href="../../lib/layui/css/layui.css" media="all">
        <link rel="stylesheet" href="../../lib/layui/css/layui.mobile.css" media="all">
        <link rel="stylesheet" href="../../css/public.css" media="all">
        <style>
            body {
                background-color: #ffffff;
            }
        </style>
    </head>
</head>
<body>
<div class="layuimini-container">
    <div class="layuimini-main">
        <fieldset class="table-search-fieldset">
            <legend>搜索信息</legend>
            <div style="margin: 10px 10px 10px 10px;">
                <form class="layui-form layui-form-pane" action="">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">名称</label>
                            <div class="layui-input-inline">
                                <input type="text" name="name" autocomplete="off"
                                       class="layui-input"/>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">热度</label>
                            <div class="layui-input-inline">
                                <input type="number" name="hot" autocomplete="off" lay-verify="hot"
                                       class="layui-input"/>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">发布时间</label>
                            <div class="layui-input-inline" style="width: 150px">
                                <input type="text" name="made_time_start" id="made_time_start" lay-verify="made_time_start" autocomplete="off" class="layui-input"/>
                            </div>
                            <div class="layui-form-mid">-</div>
                            <div class="layui-input-inline" style="width: 150px">
                                <input type="text" name="made_time_end" id="made_time_end" autocomplete="off" lay-verify="made_time_end" class="layui-input"/>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <button type="submit" class="layui-btn layui-btn-primary" lay-submit lay-filter="data-search-btn">
                                <i class="layui-icon"></i>
                                搜 索
                            </button>
                        </div>
                    </div>
                </form>
            </div>
        </fieldset>

        <script type="text/html" id="toolbarDemo">
            <div class="layui-btn-container">
                <button class="layui-btn layui-btn-sm layui-btn-danger data-delete-btn">删除</button>
            </div>
        </script>

        <table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>

        <script type="text/html" id="currentRecordBar">
            <a class="layui-btn layui-btn-xs data-count-edit" lay-event="copy">复制</a>
            <a class="layui-btn layui-btn-xs layui-btn-danger data-count-delete" lay-event="delete">删除</a>
            <a class="layui-btn layui-btn-xs layui-btn-warm data-count-more" lay-event="more"><i
                    class="fa fa-ellipsis-h"></i></a>
        </script>
    </div>
</div>

<script src="../../lib/layui/layui.all.js" charset="utf-8"></script>
<script src="../../js/layui-config.js" charset="utf-8"></script>
<script>
    layui.use(['form', 'table', 'wsiteapi','laydate'], function () {
        var form = layui.form,
            layer = layui.layer,
            table = layui.table,
            wsiteapi = layui.wsiteapi,
            laydate = layui.laydate,
            $ = layui.$;

        laydate.render({
            elem: '#made_time_start'
        });
        laydate.render({
            elem: '#made_time_end'
        });
        wsiteapi.init();

        table.render({
            elem: '#currentTableId',
            url: wsiteapi.envConfig.url + 'seed/data',
            contentType: 'application/json',
            method: 'post',
            parseData: function (res) {
                console.log('parse data res:', res);
                return {
                    "code": res.code,
                    "msg": res.msg,
                    "count": res.data.total,
                    // "count": 1000,
                    "data": res.data.contents,
                };
            },
            toolbar: '#toolbarDemo',
            defaultToolbar: ['filter', 'exports', 'print', {
                title: '提示',
                layEvent: 'LAYTABLE_TIPS',
                icon: 'layui-icon-tips'
            }],
            cols: [[
                {type: "checkbox", width: 50, fixed: "left"},
                {field: 'id', width: 80, title: 'ID', sort: true},
                {field: 'name', width: 80, title: '种子名称'},
                {field: 'size', width: 80, title: '大小', sort: true},
                {field: 'hot', width: 80, title: '热度'},
                {field: 'uri', title: '链接', minWidth: 150},
                {field: 'made_time', width: 80, title: '发布时间', sort: true},
                {field: 'updated_time', width: 80, title: '更新时间'},
                {field: 'created_time', width: 80, title: '创建时间', sort: true},
                {title: '操作', minWidth: 10,maxWidth:50, templet: '#currentRecordBar', fixed: "right", align: "center"}
            ]],
            request: {
                pageName: 'pageno',
                limitName: 'pageSize'
            },
            response: {
                statusName: 'code',
                statusCode: 200,
            },
            limits: wsiteapi.envConfig.limits,
            limit: wsiteapi.envConfig.defaultLimit,
            page: true

        });

        // 查询表单监听
        form.on('submit(data-search-btn)', function (data) {
            console.log('form data', data);
            var param_json = JSON.stringify(data.field);
            layer.alert(param_json, {
                title: '最终搜索条件'
            });

            table.reload('currentTableId', {
                where: data.field
            });
            return false;
        });

        // 工具栏按钮监听
        $('.data-add-btn').on('click', function () {
            var index = layer.open({
                title: '添加元素',
                type: 2,
                shade: 0.2,
                maxmin: true,
                shadeClose: true,
                area: ['90%', '50%'],
                content: './add_actor.html',
            });
            $(window).on('resize', function () {
                layer.full(index);
            });
            return false;
        });

        // 工具栏删除按钮监听
        $('.data-delete-btn').on('click', function () {
            var checkStatus = table.checkStatus('currentTableId'),
                data = checkStatus.data;

            layer.alert(JSON.stringify(data), {
                title: '删除数据详情'
            });
        });

        // 表格复选框监听
        table.on('checkbox(currentTableFilter)', function (obj) {
            console.log(obj);

        });

        // 表格操作栏监听
        table.on('tool(currentTableFilter)', function (obj) {
            var data = obj.data;
            if (obj.event === 'edit') {
                var index = layer.open({
                    title: '添加演员',
                    type: 2,
                    shade: 0.2,
                    maxmin: true,
                    shadeClose: true,
                    area: ['100%', '100%'],
                    content: './add_actor.html',
                });
                $(window).on('resize', function () {
                    layer.full(index);
                });
                return false;
            } else if (obj.event === 'delete') {
                layer.confirm('真的删除行么', function (index) {
                    obj.del();
                    layer.close(index);
                });
            }
        })

    });
</script>

</body>
</html>
